// =============================================================================
// SCSS/SITE/STACKS/ETHOS/_TOPBAR.SCSS
// -----------------------------------------------------------------------------
// Contains styles for the topbar.
// =============================================================================

// =============================================================================
// TABLE OF CONTENTS
// -----------------------------------------------------------------------------
//   01. Base Styles
// =============================================================================

// Base Styles
// =============================================================================

.x-topbar {
  position: relative;
  min-height: 36px;
  background-color: darken($navbarBackground, 6.5%);
  z-index: $zindexNavbar + 1;
  @include clearfix();
  @include break(middle-bear) { text-align: center; }

  .p-info {
    float: left;
    margin: 10px 0 0;
    @include font-size(1.2);
    line-height: 1.3;
    color: $topbarBottomFooterColor;
    @include break(middle-bear) {
      float: none;
      margin: 0;
      border: 1px solid rgba(255, 255, 255, 0.075);
      border-top: 0;
      padding: 0.85em 0.85em 0.75em;
    }

    a {
      color: $topbarBottomFooterColor;

      &:hover {
        color: auto;
      }
    }
  }

  .x-social-global {
    float: right;
    margin-top: 9px;
    @include translate3d(0, 0, 0);
    @include break(middle-bear) {
      float: none;
      margin-top: 9px;
      margin-bottom: 12px;
    }

    a {
      margin-left: 8px;
      @include font-size(1.7);
      @include break(middle-bear) {
        margin: 0 1.75%;
      }

      i {
        display: block;
      }
    }
  }
}

.x-navbar-fixed-left-active,
.x-navbar-fixed-right-active {
  .x-topbar {
    border-bottom: 1px solid darken($navbarBackground, 17.5%);
    z-index: $zindexNavbar - 2;
    @include break(cubs) {
      border-bottom: 1px solid darken($navbarBackground, 5%);
      z-index: $zindexNavbar + 1;
    }
  }
}